<template>
	<view class="bi-navigation-button" :class="{'is-disabled': disabled}" @click="handleClick"></view>
</template>

<script>
export default {
	name: 'BiNavigationButton',
	props: {
		disabled: {
			type: Boolean,
			default: false
		}
	},
	methods: {
		handleClick () {
			if (this.disabled) {
				return
			}
			this.$emit('click')
		}
	}
}
</script>

<style lang="less">
.bi-navigation-button{
	width: 24px;
	height: 24px;
	display: inline-block;
	background: url('./btn3.png') no-repeat 50% 50%;
	background-size: cover;
	vertical-align: top;
	&.is-disabled {
		opacity: .6;
	}
}
</style>